// 引入request函数
import { request } from '../../request/request'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // tabs标签列表
    tabsList: [],
    // 当前激活的tabs标签的索引
    currentIndex: 0,
    // 当前激活的tabs标签的id
    currentId: 0,
    // 商品列表
    goodsList: [],
    // 当前页码，默认为1
    currentPage: 1,
    // 数据总页数
    totalPages: 0,
    // 每页显示数据条数，默认为10
    pageSize: 10,
    // 当前激活状态标签(显示在视图中)的id属性
    toIndex: 'view',
    // <scroll-view>向左滚动距离
    scrollLeft: 0
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getTabsList(options.id - 0)
    this.getGoodsList(options.id - 0)
  },
  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    // 先清空原有的商品数据，让当前页为1
    this.setData({
      goodsList: [],
      currentPage: 1
    })
    this.getGoodsList(this.data.currentId)
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    let { currentPage, totalPages, currentId } = this.data
    // 若当前页面大于等于总页数，没有下一页，提示用户到底了
    if (currentPage >= totalPages) {
      wx.showToast({
        title: '我是有底线的---',
        icon: 'none',
        image: '',
        duration: 1500,
        mask: true
      })
    } else {
      // 若有下一页
      // 让当前页面++
      currentPage++
      // 更新data中当前页码数据
      this.setData({
        currentPage
      })
      // 发送请求获取下一页数据
      this.getGoodsList(currentId)
    }
  },
  // 发送请求获取tabs分类标签数据
  async getTabsList(id) {
    const res = await request({url: '/goods/category', data: {id}})
    let tabsList = res.data.brotherCategory
    // 获取激活状态tabs标签的索引
    const index = tabsList.findIndex(item => item.id === id)
    // 设置滚动到tabs标签的id(toIndex,须放在发送数据中设置
    // 放在onload函数中，此时页面尚未有数据，页面尚未形成，所以无效)
    let toIndex = 'view' + index
    // 更新data中数据
    this.setData({
      tabsList,
      currentIndex: index,
      currentId: id,
      toIndex
    })
  },
  // 监听点击切换tabs标签
  handleSwitchTab(e) {
    // 获取当前被点击tabs标签的id值和索引
    const { id, index } = e.currentTarget.dataset
    // 更新data中数据
    this.setData({
      // 点击tabs标签时，先清空原有id的商品数据，再发送请求获取对应id的数据
      goodsList: [],
      currentIndex: index,
      currentId: id,
      scrollLeft: index * 70
    })
    this.getGoodsList(id)
  },
  // 根据tabs标签的id值发送请求，获取商品数据
  async getGoodsList(id) {
    // 获取当前页码和单页数据条数
    const { currentPage, pageSize } = this.data
    // 发送请求获取商品数据
    const res = await request({url: '/goods/list', data: {categoryId: id, size: pageSize, page: currentPage}})
    console.log(res)
    this.setData({
      totalPages: res.data.totalPages,
      // 将原有data中的数据和新获取到的数据拼接,便于上拉触底时，渲染页面
      goodsList: [...this.data.goodsList, ...res.data.goodsList]
    })
    // 请求成功后，停止当前页面下拉刷新
    wx.stopPullDownRefresh()
  }
})